<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title th:text="${title}"></title>
    <meta name="description" th:content="#{admin.desc}" />
    <meta name="author" th:content="#{admin.author}" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="renderer" content="webkit" />
    
    <link rel="icon" type="image/png" href="/static/admin/i/favicon.png" />
    <link rel="apple-touch-icon-precomposed" href="/static/admin/i/app-icon72x72@2x.png" />
    <link rel="stylesheet" href="/static/admin/css/amazeui.min.css" />
    <link rel="stylesheet" href="/static/admin/css/app.css" />
    <script src="/static/common/js/jquery.min.js"></script>
    
    <style>
        body {
            background: url("/static/admin/img/k.jpg") no-repeat center !important;
            background-size: 100%;
        }
    </style>
</head>

<body class="theme-white">
<div class="am-g tpl-g">
    <!-- 风格切换 -->
    <div class="tpl-skiner">
        <div class="tpl-skiner-toggle am-icon-cog">
        </div>
        <div class="tpl-skiner-content">
            <div class="tpl-skiner-content-title">选择主题</div>
            <div class="tpl-skiner-content-bar">
                <span class="skiner-color skiner-white" data-color="theme-white"></span>
                <span class="skiner-color skiner-black" data-color="theme-black"></span>
            </div>
        </div>
    </div>
    
    <div class="tpl-login">
        <div class="tpl-login-content">
            <div class="tpl-login-logo"></div>
            
            <form class="am-form">
                <div class="am-form-group">
                    <input type="text" name="username" value="admin3" id="user-name" placeholder="请输入账号">
                </div>
                
                <div class="am-form-group">
                    <input type="password" name="password" value="aaaaaaa" id="user-pass" placeholder="请输入密码">
                </div>
                
                <div class="am-form-group">
                    <button type="button" class="am-btn am-btn-primary am-btn-block tpl-btn-bg-color-success  tpl-login-btn"
                            data-am-loading="{loadingText: '正在登录...'}" id="login-btn">提交</button>
                </div>
                
            </form>
        </div>
    </div>
</div>


<script src="/static/admin/js/theme.js"></script>
<script src="/static/admin/js/amazeui.min.js"></script>
<script src="/static/admin/js/app.js"></script>
<script src="/static/common/js/jdialog/JDialog.min.js"></script>

<script>
    $(document).ready(function () {
        
        $("#login-btn").on("click", function () {
            
            var username = $("#user-name").val().trim();
            var password = $('#user-pass').val().trim();
            if (username == '') {
                return JDialog.msg({type:'error', content:'请输入账号', offset:50});
            }
            if (password == '') {
	            return JDialog.msg({type:'error', content:'请输入密码', offset:50});
            }
            
            $(this).button("loading");
            var that = this;
            
            $.post("/admin/doLogin", {
                "username" : username,
                "password" : password
            }, function (res) {
                
                if (res.code == "000") {
	                JDialog.msg({type:'ok', content:'登录成功.', offset:50});
                    setTimeout(function () {
	                    location.href = "/admin/index";
                    }, 1000);
                } else {
	                JDialog.msg({type:'error', content:res.message, offset:50});
                }
                $(that).button("reset");
            }, "json");
        });
    
        //触发回车键登录
        $(document).keyup(function (e) {
            if (e.keyCode == 13) {
                $('#login-btn').trigger("click");
            }
        })
    });
</script>
</body>

</html>